﻿//表格管理 - 基本表格
layui.use(['form', 'jquery', 'laydate', 'layer', 'dialog', 'table', 'laypage', 'ajaxUtil'
    , 'permissionUtil', 'switchTab', 'tableCheckBoxMultiColumnUtil'], function () {
        var table = layui.table,
            laypage = layui.laypage,
            $ = layui.jquery,
            layer = layui.layer,
            dialog = layui.dialog,
            ajaxutil = layui.ajaxUtil,
            laydate = layui.laydate,
            form = layui.form,
            permissionUtil = layui.permissionUtil,
            switchTab = layui.switchTab,
            tableCheckBoxMultiColumnUtil = layui.tableCheckBoxMultiColumnUtil;
        permissionUtil.setting(100015);

        var vApp = new Vue({});
        vApp = new Vue({
            el: '#vMultiIndexApp',
            data: function () {
                return {
                    //姓名
                    employeeName: ''
                };
            },
            created: function () {
                //getUserAccount();
                //debugger;
            },
            mounted: function () {
                var self = this;

                //初始化vue后,显示vue模板布局
                //document.getElementById("dataList").style.display = "block";
            },
            watch: {},
            methods: {

            },
            updated: function () {

            }
        });

        //表格渲染
        table.render({
            id: 'cn_GridCheckBoxTable'
            , elem: '#grid_CheckBoxTable'
            , method: 'post'
            , url: '/tabledata/basictable/list'
            //启动分页
            , page: true
            , height: 'full-100'
            , loading: true
            , text: { none: '未查询到数据' }
            , limit: 20
            , limits: [20, 50, 100]
            //禁用前端自动排序
            , autoSort: false
            , where: {
                name: ''
            }
            , request: {
                pageName: 'pageIndex'
                , limitName: 'pageSize'
            }
            , response: {
                //statusName: 'status', //规定数据状态的字段名称，默认：code
                statusCode: 200, //规定成功的状态码，默认：0
                //msgName: 'hint', //规定状态信息的字段名称，默认：msg
                countName: 'total', //规定数据总数的字段名称，默认：count
                //dataName: 'rows' //规定数据列表的字段名称，默认：data
            }
            , cols: [[
                { checkbox: true }
                , { field: 'employeeId', width: 80, title: '编号' }
                , { field: 'employeeName', width: 150, title: '姓名' }
                , { field: 'employeeAge', title: '年龄', width: 100 }
                , { field: 'education', width: 180, title: '学历' }
                , { field: 'contactPhone', width: 150, title: '联系方式' }
            ]]
            , done: function (data) {
                console.log(data);
                //初始化表格行选中状态[多列]
                tableCheckBoxMultiColumnUtil.checkedDefault({
                    gridId: 'cn_GridCheckBoxTable'
                    , fieldName: 'employeeId'
                });
            }
        });

        ///初始化分页设置[多列]
        tableCheckBoxMultiColumnUtil.init({
            gridId: 'cn_GridCheckBoxTable'
            , filterId: 'ft_CheckBoxTable'
            , fieldName: 'employeeId'
            , attachFieldsName: ['employeeAge', 'education']
        });

        //筛选
        $('#btn_CheckBoxSearch').on('click', function () {
            //执行重载
            table.reload('cn_GridCheckBoxTable', {
                page: {
                    curr: 1 //重新从第 1 页开始
                }
                , where: {
                    name: vApp.employeeName
                }
            });
        });

        //获取多列选中内容
        $("#btn_CheckBoxTableMultiColumnGetValue").on('click', function () {
            var selectedData = tableCheckBoxMultiColumnUtil.getValue({
                gridId: 'cn_GridCheckBoxTable'
            });

            //统计选中所有的年龄之和
            //var ageSum = 0;
            //$.each(selectedData, function (index, item) {
            //    ageSum += item.EmployeeAge;
            //});
            //alert(ageSum);

            alert(JSON.stringify(selectedData));
        });

    });